<template>
    <div>
        <el-row>
            <el-col :span="8" align="left">
                <span>产品：</span>
                <el-select v-model="productIds" filterable multiple placeholder="请选择">
                    <el-option
                    v-for="item in options"
                    :key="item.productId"
                    :label="item.productName"
                    :value="item.productId">
                    </el-option>
                </el-select>
            </el-col>   
        </el-row>
        <el-row>
            <el-col :span="4" align="left">
                <el-button type="success" @click="exports" :disabled="loading" :loading="loading">导出数据</el-button>
            </el-col>
            <el-col :span="16"></el-col>
            <el-col :span="4" align="right">
                
            </el-col>
        </el-row> 
    </div>
</template>

<script>
export default {
    data(){
        return{
            productIds:[],
            options:[],
            loading:false,
        }
    },
    mounted(){
        this.searchProduct();
    },
    methods:{
        searchProduct(){
            this.getRequest("/common/get_all_product_info").then(resp=>{
                if (resp && resp.data.status == 200){
                    this.options=resp.data.obj
                }
            })
        },
        exports(){
            this.loading=true;
            var address="/api/report/productAnalysis/export?productIds="+this.productIds;
            this.common.downloadFile(address); 
            setTimeout(()=>{
                this.loading=false;
            },3000)   
        }
    }
}
</script>
<style scoped>
.el-row {
  margin-bottom: 30px;
  height: 50px;
  line-height: 50px;
}
.el-col {
  height: 50px;
  line-height: 50px;
}
.el-input,.el-input__inner{
    width: 70%;
}
.el-select{
    width: 50%;
}
</style>
